<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
		<!-- <link href="../bower_components/google-code-prettify/src/prettify.css" rel="stylesheet" /> -->
		<link rel="stylesheet" href="css/bootstrap.css" />
		<link
			href="http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css"
			rel="stylesheet"
		/>
		<link href="./css/style.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/publish_article.css" />
	</head>
	<body>
		<div class="container col-sm-12">
			<form role="form" class="col-sm-8 article_form">
				<div class="form-group">
					<label for="name" class="col-sm-12 title_lab">文章标题</label>
					<div class="col-sm-10 title_inp">
						<input
							type="text"
							class="form-control"
							id="article_title"
							placeholder="请输入文章标题"
						/>
					</div>
					<label for="name" class="col-sm-12 title_lab">文章分类</label>
					<div class="form-group col-sm-10 article_sel">
						<select class="form-control" id="sel"></select>
					</div>
				</div>
				<!-- <button type="submit" class="btn btn-default">提交</button> -->
			</form>
			<div class="col-sm-10 rich_text">
				<strong>文章内容</strong>
				<div class="btn-toolbar" data-role="editor-toolbar" data-target="#editor">
					<div class="btn-group">
						<a
							class="btn btn-default dropdown-toggle"
							data-toggle="dropdown"
							title="Font Size"
							><i class="fa fa-text-height"></i>&nbsp;<b class="caret"></b
						></a>
						<ul class="dropdown-menu">
							<li><a data-edit="fontSize 5" class="fs-Five">Huge</a></li>
							<li><a data-edit="fontSize 3" class="fs-Three">Normal</a></li>
							<li><a data-edit="fontSize 1" class="fs-One">Small</a></li>
						</ul>
					</div>
					<div class="btn-group">
						<a
							class="btn btn-default dropdown-toggle"
							data-toggle="dropdown"
							title="Text Highlight Color"
							><i class="fa fa-paint-brush"></i>&nbsp;<b class="caret"></b
						></a>
						<ul class="dropdown-menu">
							<p>&nbsp;&nbsp;&nbsp;Text Highlight Color:</p>
							<li><a data-edit="backColor #00FFFF">Blue</a></li>
							<li><a data-edit="backColor #00FF00">Green</a></li>
							<li><a data-edit="backColor #FF7F00">Orange</a></li>
							<li><a data-edit="backColor #FF0000">Red</a></li>
							<li><a data-edit="backColor #FFFF00">Yellow</a></li>
						</ul>
					</div>
					<div class="btn-group">
						<a
							class="btn btn-default dropdown-toggle"
							data-toggle="dropdown"
							title="Font Color"
							><i class="fa fa-font"></i>&nbsp;<b class="caret"></b
						></a>
						<ul class="dropdown-menu">
							<p>&nbsp;&nbsp;&nbsp;Font Color:</p>
							<li><a data-edit="foreColor #000000">Black</a></li>
							<li><a data-edit="foreColor #0000FF">Blue</a></li>
							<li><a data-edit="foreColor #30AD23">Green</a></li>
							<li><a data-edit="foreColor #FF7F00">Orange</a></li>
							<li><a data-edit="foreColor #FF0000">Red</a></li>
							<li><a data-edit="foreColor #FFFF00">Yellow</a></li>
						</ul>
					</div>
					<div class="btn-group">
						<a class="btn btn-default" data-edit="bold" title="Bold (Ctrl/Cmd+B)"
							><i class="fa fa-bold"></i
						></a>
						<a class="btn btn-default" data-edit="italic" title="Italic (Ctrl/Cmd+I)"
							><i class="fa fa-italic"></i
						></a>
						<a class="btn btn-default" data-edit="strikethrough" title="Strikethrough"
							><i class="fa fa-strikethrough"></i
						></a>
						<a
							class="btn btn-default"
							data-edit="underline"
							title="Underline (Ctrl/Cmd+U)"
							><i class="fa fa-underline"></i
						></a>
					</div>
					<div class="btn-group">
						<a
							class="btn btn-default"
							data-edit="insertunorderedlist"
							title="Bullet list"
							><i class="fa fa-list-ul"></i
						></a>
						<a class="btn btn-default" data-edit="insertorderedlist" title="Number list"
							><i class="fa fa-list-ol"></i
						></a>
						<a
							class="btn btn-default"
							data-edit="outdent"
							title="Reduce indent (Shift+Tab)"
							><i class="fa fa-outdent"></i
						></a>
						<a class="btn btn-default" data-edit="indent" title="Indent (Tab)"
							><i class="fa fa-indent"></i
						></a>
					</div>
					<div class="btn-group">
						<a
							class="btn btn-default"
							data-edit="justifyleft"
							title="Align Left (Ctrl/Cmd+L)"
							><i class="fa fa-align-left"></i
						></a>
						<a
							class="btn btn-default"
							data-edit="justifycenter"
							title="Center (Ctrl/Cmd+E)"
							><i class="fa fa-align-center"></i
						></a>
						<a
							class="btn btn-default"
							data-edit="justifyright"
							title="Align Right (Ctrl/Cmd+R)"
							><i class="fa fa-align-right"></i
						></a>
						<a
							class="btn btn-default"
							data-edit="justifyfull"
							title="Justify (Ctrl/Cmd+J)"
							><i class="fa fa-align-justify"></i
						></a>
					</div>
					<div class="btn-group">
						<a
							class="btn btn-default dropdown-toggle"
							data-toggle="dropdown"
							title="Hyperlink"
							><i class="fa fa-link"></i
						></a>
						<div class="dropdown-menu input-append">
							<input placeholder="URL" type="text" data-edit="createLink" />
							<button class="btn" type="button">Add</button>
						</div>
					</div>
					<div class="btn-group">
						<a class="btn btn-default" data-edit="unlink" title="Remove Hyperlink"
							><i class="fa fa-unlink"></i
						></a>
						<span
							class="btn btn-default"
							title="Insert picture (or just drag & drop)"
							id="pictureBtn"
						>
							<i class="fa fa-picture-o"></i>
							<input
								class="imgUpload"
								type="file"
								data-role="magic-overlay"
								data-target="#pictureBtn"
								data-edit="insertImage"
							/>
						</span>
					</div>
					<div class="btn-group">
						<a class="btn btn-default" data-edit="undo" title="Undo (Ctrl/Cmd+Z)"
							><i class="fa fa-undo"></i
						></a>
						<a class="btn btn-default" data-edit="redo" title="Redo (Ctrl/Cmd+Y)"
							><i class="fa fa-repeat"></i
						></a>
						<a
							class="btn btn-default"
							data-edit="clearformat"
							title="Clear Formatting"
							onClick="$('#editor').html($('#editor').text());"
							><i class="glyphicon glyphicon-fire"></i
						></a>
					</div>
				</div>
				<div id="editor" class="lead col-sm-8" data-placeholder="请输入内容"></div>
				<div id="editorPreview"></div>
				<div class="col-sm-12">
					<button type="button" id="sub" class="btn btn-info col-sm-1 col-sm-offset-4">
						提交文章
					</button>
				</div>
			</div>
		</div>
		<div id="myAlert" class="alert alert-success col-sm-4 col-sm-offset-3">
			<a href="#" class="close" data-dismiss="alert">&times;</a>
			<strong>文章发布成功!!!</strong>
		</div>
	</body>
	<script src="node_modules/axios/dist/axios.js"></script>
	<script src="js/jquery.js"></script>
	<script src="js/bootstrap.js"></script>
	<script src="./node_modules/bootstrap-wysiwyg/js/bootstrap-wysiwyg.min.js"></script>
	<script src="./node_modules/jquery.hotkeys/jquery.hotkeys.js"></script>
	<script type="text/javascript">
		$("#editor").wysiwyg();

		$(".dropdown-menu > input").click(function (e) {
			e.stopPropagation();
		});
	</script>
	<script src="js/register.js"></script>
	<script>
		let admin = new Admin();
		//判断是否有权限
		admin.jurisdiction();
		//创建文章分类
		admin.createOption("https://ty.php800.cn/api/article/classshow.php", "#sel", "title");

		document.querySelector("#sub").addEventListener("click", () => {
			let formdata = new FormData();

			formdata.append("title", admin.getVal("#article_title"));
			formdata.append("userid", JSON.parse(localStorage.getItem("user")).id);
			formdata.append("body", document.querySelector("#editor").innerHTML);
			formdata.append("classid", admin.getVal("#sel"));
			admin
				.publish_article(formdata)
				.then((result) => {
					let { msg, verify } = result.data;
					admin.popUpBox(verify, msg);
				})
				.catch((err) => {});
		});
	</script>
</html>
